/* CSS Document */
body {
	margin:0px; 
	padding:0px; 
	/*background:url(images/mainbg.gif) 0 0 repeat-x #F6F4E4;
	background: url(images/mainbg.gif) 0 0 repeat-x #EDEDED;*/
	background: url(../images/mainbg.gif) 0 0 repeat-x #F2F2F2;
	/*color:#6B6854; font:12px Arial, Helvetica, sans-serif;*/
	color:#666666; font:14px/20px Calibri, Helvetica, sans-serif;
}

/* hapus

div, /*p,*/ /* hapus ul,*/ /*h1,*/ /* hapus h2, h4, img, form, label {
	padding:0px; 
	margin:0px;
}

hapus */

ul {
	list-style-type:none;
}

/*----MAIN PANEL----*/

#mainPan {
	/*width:800px;*/
	width:960px;
	margin:0 auto; 
	padding:0px;
}

/*----Left Panel----*/

#leftPan {
	width:240px; 
	float:left;
}
#leftTopPan {
	width:240px; 
	/*height:125px;*/
	height:171px; 
	margin:0 auto; 
	padding:0; 
	/*background:url(images/left-top.png) 0 0 no-repeat;*/
	/*position: fixed;*/
}
#leftTopPan img {
	margin:0px 0 0 37px;
}


/* hapus

#leftPan ul {
	width:240px; 
	/*height:231px;*/
	/*height:310px;*/
	/*height:245px;*/
	
/* hapus

	height:277px;
	display:block; 
	/*background:url(../images/menu-bg.png) 0 0 no-repeat; */
	
/* hapus

	background: none repeat scroll 0 0 #FFCCCC;
	/*padding:28px 0 0;*/
	
/* hapus

	padding:1px 0 0;

/* hapus
	
	/*margin-top: 10px;*/
	/*margin-top: 20px;*/

/* hapus

	border-radius: 3px;
	box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.4);
	border: 1px solid rgba(0, 0, 0, 0.16);
}
#leftPan ul li {
	width:200px; 
	/*height:27px;*/
	
/* hapus

	position:relative; 
	/*margin:0 auto;*/
	
/* hapus	
	
	background:url(../images/dot.gif) 0 100% repeat-x;
	
	height:20px;
	margin: 23px 0 0 19px;
}
#leftPan ul li a {
	width:96px; 
	height:26px; 
	/*background:url(images/arrow-normal.gif) 0 50% no-repeat #F6F4E4;*/
	/*color:#8F8C73;*/
	
/* hapus	
	
	color:#000; 
	font:13px Verdana, Arial, Helvetica, sans-serif; 
	font-weight:bold; 
	/*padding:0 0 0 22px;*/
	
/* hapus	
	
	text-decoration:none;
}
#leftPan ul li a:hover {
	/*background:url(../images/arrow-normal.gif) 0 50% no-repeat #F6F4E4;*/
	/*background:url(../images/arrow3.gif) 0 50% no-repeat #FFCCCC;*/
	/*color:#7F0A5F;*/
	
/* hapus	
	
	color:#0078ff;
	text-decoration:none;
	
}
#leftPan ul li.home {
	width:96px; 
	height:27px; 
	display:block; 
	background: url(../images/homebg.gif) 0 0 no-repeat #F6F4E4; 
	color:#7F0A5F; font:11px Arial, Helvetica, sans-serif; 
	font-weight:bold; 
	text-decoration:none; 
	padding:0 0 0 22px;
}
#leftPan ul li.contact {
	background:none;
}
#leftPan ul.linkone {
	width:240px; 
	padding:0; 
	margin:0px auto; 
	background:none;
}
#leftPan ul.linkone li {
	width:118px; 
	height:26px; 
	position:relative; 
	margin:0 auto; 
	background:none; 
	padding:0px;
}
#leftPan ul.linkone li a {
	width:110px; 
	height:26px; 
	display:block; 
	background:url(../images/arrow-normal.gif) 0 50% no-repeat #F6F4E4; 
	color:#8F8C73; 
	font:11px  Arial, Helvetica, sans-serif; 
	font-weight:normal; 
	padding:0 0 0 22px; 
	text-decoration:underline;
}
#leftPan ul.linkone li a:hover {
	background:url(../images/arrow-normal.gif) 0 50% no-repeat #F6F4E4; 
	color:#25241E; 
	text-decoration:underline;
}

hapus */

#leftPan h2 {
	width:110px; 
	height:30px; 
	background:#F6F4E4; 
	color:#8F146E; 
	font-size:12px; 
	padding:20px 0 0 20px; 
	font-weight:normal;
}
#leftPan form {
	/*width:222px;*/
	width:200px;
	height:173px; 
	position:relative; 
	margin:0 auto; 
	/*background:url(images/formbg.gif) 0 0 no-repeat #ABA894;*/
	/*background:url(../images/formbg.png) 0 0 no-repeat #ededed;*/
	color:#fff;
}

/*
#leftPan form input {
	width:143px; 
	height:17px; 
	/*margin:3px 0 2px 35px; */
/*	margin:30px 0 2px 35px;
	padding:4px; 
	border:1px solid #666666;
}
*/
#leftPan form label {
	width:143px; 
	height:18px; 
	margin:2px 0 0 35px; 
	font:11px Arial, Helvetica, sans-serif; 
	font-weight:bold;
}

/*
#leftPan form input.button {
	width:51px; 
	height:17px; 
	float:left; 
	background:url(../images/button.gif) 0 0 no-repeat #FEFEFE; 
	color:#fff; 
	font-size:12px; 
	font-weight:bold; 
	line-height:18px; 
	border:none; 
	padding:0 10px 0 0;  
	/*margin:3px 10px 2px 28px;*/
	
/*	margin:14px 10px 2px 90px;
	cursor:pointer;
}
*/
#leftPan form h2 {
	width:150px; 
	/*height:47px;*/
	height:44px; 
	display:block; 
	/*background:url(images/memberbg.gif) 0 0 no-repeat #D5D2BC;*/
	background:url(../images/memberbg.png) 0 0 no-repeat #ededed; 
	/*color:#666;*/
	color:#FFF; 
	font-size:15px; 
	line-height:47px;
	padding:0 0 0 65px; 
	font-size:14px;
}
#leftPan form #register {
	width:100px; 
	height:24px; 
	float:left; 
	margin:3px 0 0; 
}
#leftPan form #register a {
	display:block; 
	background: url(../images/arrow4.gif) 100% 50% no-repeat #ABA894; 
	color:#fff; 
	font-size:14px; 
	padding:0 5px 0 0; 
	text-decoration:none;
}
#leftPan form #register a:hover {
	text-decoration:underline;
}

/*----/Left Panel----*/

/*----Right Panel----*/

#rightPan {
	/*width:551px;*/
	width:720px;
	float:left;
}
#rightPan fieldset { 
	margin:15px;
}
#rightPan form input { 
	/*margin:3px 0 2px 0;*/
	margin:10px 0 2px 0; 
	padding:4px; 
	border:1px solid #666666;
}
#rightPan form label { 
	/*margin:2px 0 0 35px;*/
	font:11px Arial, Helvetica, sans-serif; 
	font-weight:bold;
}
#rightPan form textarea { 
	font-family:Arial; 
	margin:3px 0 2px 0; 
	padding:4px; 
	border:1px solid #666666;
}
#rightPan form input.button { 
	padding:10px; 
	cursor:pointer; 
	background:#FF9900;
}
#rightPan ul { 
	margin-left:60px;
	text-align: justify;
}
#rightPan li { 
	margin:0 auto;  
	list-style:square; 
	line-height:25px;
}
#rightPan h1 {
	/*width:438px;*/
	/*width:855px;*/
	width:800px; 
	height:124px; 
	/*background:url(images/header.png) 0 0 no-repeat #D33F9F;*/
	background:url(../images/header.png) 0 0 no-repeat #1456AD;
	/*
	background:url (<embed src="../images/land-images/awan/awan.swf"
									quality="high" bgcolor="white" width="100px" height="100px"
									type="application/x-shockwave-flash"
									pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?
									P1_Prod_Version=ShockwaveFlash"></embed>);
	*/
	color:#fff; 
	font:20px Arial, Times, serif; 
	/*padding:37px 0 0 13px;*/
	padding:33px 0 0 15px; 
	font-weight:bold;
}
#rightPan h1 p {
	font:13px  Arial, Helvetica, sans-serif; 
	font-weight:bold; 
	padding:0px;
}
#rightPan h2 { 
	/*height:36px;*/
	/*height:49px;*/
	/*background:url(images/icon2.jpg) 0 0 no-repeat #F6F4E4;*/
	/*background:url(../images/icon2.jpg) 0 0 no-repeat #ededed;*/
	/*background:url(../images/icon2.jpg) 0 0 no-repeat #f2f2f2;*/
	/*margin:29px 0 0 9px;*/
	/*padding:0 0 0 75px;*/
	
	
	height:25px;
	color:#8F146E; 
	font-size:16px; 
	line-height:36px;
	padding:0 0 0 25px; 
	margin: 13px 0 0 9px;
	width:630px;
	/*border-bottom:1px solid #DADADA;*/

  /*margin: 13px 0 0 56px;*/
	
	/*
	border-radius: 6px 6px 6px 6px;
  box-shadow: 0 0 5px 0;
  color: #8F146E;
  font-size: 16px;
  height: 28px;
  line-height: 30px;
  margin: 21px 8px 0 37px;
  padding: 5px 5px 5px 8px;
  */
}
#rightPan h4 {
	width:240px;
	height:50px; 
	display:block; 
	background:url(../images/icon2.jpg) 0 0 no-repeat #F6F4E4; 
	color:#8F146E; 
	font-size:16px; 
	line-height:22px; 
	padding:0 0 0 75px; 
	margin:0 0 0 9px; 
	clear:both;
}
#rightPan h4 span {
	color:#9F9D81; 
	background:#F6F4E4; 
	font-size:12px;
	font-weight:bold; 
	line-height:18px;
}
#rightPan p {
	padding:20px 0 0 9px;
	/*padding:20px 20px 20px 9px;*/
	/*margin-left:17px;*/
	/*margin-left:38px;*/
	text-align: justify;
	/*
	background: none repeat scroll 0 0 #FFFFFF;
  border-radius: 6px 6px 6px 6px;
  box-shadow: 0 0 5px 0;
  
  margin-top:22px;
  */
}
#rightPan p.bottompadding {
	padding:22px 0 0 9px; 
	margin:0 0 38px 0;
}
#rightPan p span.boldtext {
	font-weight:bold;
}
#rightPan p span.magedacolortext {
	background:#F6F4E4; 
	color:#8F146E;
}
#rightmorePan {
	width:420px; 
	height:28px; 
	display:block; 
	background:url(../images/pattern.gif) 0 0 repeat;
	border:1px solid #fff; 
	line-height:28px;
	padding:0 0 0 20px; 
	margin:0 0 0 9px;
}
#rightmorePan p.textposition {
	float:left; 
	padding:0 0 0 18px; 
	margin:0px;
}
#rightmorePan a {
	float:left; 
	width:36px; 
	height:28px; 
	display:block; 
	background:url(../images/morebg.gif) 0 0 no-repeat #D5D2BC; 
	color:#1F1E15; 
	text-decoration:none; 
	padding:0 15px 0 45px; 
	margin:0 0 0 135px;
}
#rightmorePan a:hover {
	text-decoration:underline;
}
#rightmorenextPan {
	width:420px; 
	height:28px; 
	display:block; 
	background:url(../images/pattern.gif) 0 0 repeat; 
	border:1px solid #fff; 
	line-height:28px; 
	padding:0 0 0 20px;
	margin:0 0 0 9px;
}
#rightmorenextPan p.textposition {
	float:left; 
	padding:0 0 0 18px;
	margin:0px;
}
#rightmorenextPan a {
	float:left; 
	width:36px; 
	height:28px; 
	display:block; 
	background:url(../images/morebg.gif) 0 0 no-repeat #D5D2BC; 
	color:#1F1E15; 
	text-decoration:none; 
	padding:0 15px 0 45px; 
	margin:0 0 0 135px;
}
#rightmorenextPan a:hover {
	text-decoration:underline;
}
#rightaddPan {
	width:442px; 
	height:170px; 
	position:relative; 
	margin:0 auto; 
	padding:50px 0 0 9px;
}
#rightaddonePan {
	width:218px; 
	height:110px; 
	float:left; 
	background:url(../images/image1.jpg) 100% 0 no-repeat #CBC8B2; 
	color:#fff;
}
#rightaddonePan p.whitetext {
	font-size:22px; 
	padding:16px 0 0 16px;
}
#rightaddonePan p.whitetextbig {
	font-size:28px; 
	padding:10px 0 0 16px;
}
#rightaddonePan a {
	width:97px; 
	height:33px; 
	display:block; 
	background:url(../images/viewmore.jpg) 0 0 no-repeat #ABA894; 
	color:#fff; 
	font-size:16px; 
	line-height:30px; 
	text-decoration:none; 
	margin:15px 0 0; 
	padding:0 0 0 55px;
}
#rightaddonePan a:hover {
	text-decoration:underline;
}
#rightaddtwoPan {
	width:218px; 
	height:110px; 
	float:left; 
	background:url(../images/image2.jpg) 100% 0 no-repeat #CBC8B2; 
	color:#fff; 
	margin:0 0 0 6px;
}
#rightaddtwoPan p.whitetext {
	font-size:22px; 
	padding:16px 0 0 16px;
}
#rightaddtwoPan p.whitetextbig {
	font-size:28px; 
	padding:10px 0 0 16px;
}
#rightaddtwoPan a {
	width:82px; 
	height:33px; 
	display:block; 
	background:url(../images/viewmore.jpg) 0 0 no-repeat #ABA894; 
	color:#fff; 
	font-size:16px; 
	line-height:30px; 
	text-decoration:none; 
	margin:15px 0 0; 
	padding:0 0 0 55px;
}
#rightaddtwoPan a:hover {
	text-decoration:underline;
}

/*----/Right Panel----*/

/*----Footer Panel----*/

#footermainPan {
	/*background:url(images/footerbg.gif) 0 0 repeat-x #6B6854;*/
	background:url(../images/bg-page.png) 0 0 repeat-x #24538B;
	color:#fff; 
	/*padding-top:30px;*/
	padding-top:15px; 
	margin:0 auto; 
	/*height:70px;*/
	height:25px; 
	clear:both; 
	text-align:center;
	margin:0 auto;
	/*position:fixed;*/
	bottom: 0;
	left: 0;
	right: 0;
}
#footerPan {
	/*width:800px;*/
	width:1260px; 
	margin:0 auto; 
	font:12px/15px Arial, Helvetica, sans-serif; 
	font-weight:normal;
	
	color: yellow; 
}
#footerPan a:hover {
	/*background:url(images/arrow2.gif) no-repeat 45px 0px #B0AD93;*/
	/*color:#353427;*/
	color: yellow; 
	text-decoration:none;
}
.cleaner_h0 { 
	clear: both; 
	width:100%;
}
.cleaner_h5 { 
	clear: both; 
	width:100%; 
	height: 5px; 
}
.cleaner_h10 { 
	clear: both; 
	width:100%; 
	height: 10px;
}
.cleaner_h20 { 
	clear: both; 
	width:100%; 
	/*height: 20px;*/
	/*height: 5px;*/
	height: 25px; 
}
.cleaner_h30 { 
	clear: both; 
	width:100%; 
	height: 30px; 
}
.cleaner_h40 { 
	clear: both; 
	width:100%; 
	height: 40px; 
}
.cleaner_h50 { 
	clear: both; 
	width:100%; 
	height: 50px; 
}
.cleaner_h60 { 
	clear: both; 
	width:100%; 
	height: 60px; 
}
#loading {
	position:fixed;
	top: 0; 
	width:100%; 
	text-align:center; 
	color: #fff; 
	background-image:url(../images/spotlight-bg.png);
	padding:15px 0px 15px 0px;
	font-size:12px;
}

/*--- Tambahan ---*/

/*
.login {
  position: relative;
  margin: 0 auto;
  padding: 20px 20px 20px;
  width: 200px;
  background: white;
  border-radius: 3px;
  @include box-shadow(0 0 200px rgba(white, .5), 0 1px 2px rgba(black, .3));

  &:before {
    content: '';
    position: absolute;
    top: -8px; right: -8px; bottom: -8px; left: -8px;
    z-index: -1;
    background: rgba(black, .08);
    border-radius: 4px;
  }
  
.login-help {
  margin: 20px 0;
  font-size: 11px;
  color: white;
  text-align: center;
  text-shadow: 0 1px #2a85a1;

  a {
    color: #cce7fa;
    text-decoration: none;

    &:hover { text-decoration: underline; }
  }
}

:-moz-placeholder {
  color: #c9c9c9 !important;
  font-size: 13px;
}

::-webkit-input-placeholder {
  color: #ccc;
  font-size: 13px;
}

input {
  font-family: 'Lucida Grande', Tahoma, Verdana, sans-serif;
  font-size: 14px;
}

input[type=text], input[type=password] {
  margin: 5px;
  padding: 0 10px;
  width: 200px;
  height: 34px;
  color: #404040;
  background: white;
  border: 1px solid;
  border-color: #c4c4c4 #d1d1d1 #d4d4d4;
  border-radius: 2px;
  outline: 5px solid #eff4f7;
  -moz-outline-radius: 3px; // Can we get this on WebKit please?
  @include box-shadow(inset 0 1px 3px rgba(black, .12));

  &:focus {
    border-color: #7dc9e2;
    outline-color: #dceefc;
    outline-offset: 0; // WebKit sets this to -1 by default
  }
}

input[type=submit] {
  padding: 0 18px;
  height: 29px;
  font-size: 12px;
  font-weight: bold;
  color: #527881;
  text-shadow: 0 1px #e3f1f1;
  background: #cde5ef;
  border: 1px solid;
  border-color: #b4ccce #b3c0c8 #9eb9c2;
  border-radius: 16px;
  outline: 0;
  @include box-sizing(content-box); // Firefox sets this to border-box by default
  @include linear-gradient(top, #edf5f8, #cde5ef);
  @include box-shadow(inset 0 1px white, 0 1px 2px rgba(black, .15));

  &:active {
    background: #cde5ef;
    border-color: #9eb9c2 #b3c0c8 #b4ccce;
    @include box-shadow(inset 0 0 3px rgba(black, .2));
  }
}

 h1 {
    margin: -20px -20px 21px;
    line-height: 40px;
    font-size: 15px;
    font-weight: bold;
    color: #555;
    text-align: center;
    text-shadow: 0 1px white;
    background: #f3f3f3;
    border-bottom: 1px solid #cfcfcf;
    border-radius: 3px 3px 0 0;
    @include linear-gradient(top, whiteffd, #eef2f5);
    @include box-shadow(0 1px #f5f5f5);
  }

  p { margin: 20px 0 0; }
  p:first-child { margin-top: 0; }

  input[type=text], input[type=password] { width: 278px; }

  p.remember_me {
    float: left;
    line-height: 31px;

    label {
      font-size: 12px;
      color: #777;
      cursor: pointer;
    }
*/


a{
	color:#777;
}
a:hover{
	color:#222;
}

p{
	padding:5px 0px;
}
.wrapper{
	width:960px;
	margin:20px auto;
	min-height:550px;
}
.box{
	width:49%;
}
.left{
	float:left;
}
.right{
	float:right;
}
.clear{
	clear:both;
}
a.back{
	color:#777;
	position:fixed;
	top:5px;
	right:10px;
	text-decoration:none;
}
/* Form Style */
.form_wrapper{
	background:#fff;
	border:1px solid #ddd;
	margin:0 auto;
	width:350px;
	font-size:16px;
	-moz-box-shadow:1px 1px 7px #ccc;
	-webkit-box-shadow:1px 1px 7px #ccc;
	box-shadow:1px 1px 7px #ccc;
}
.form_wrapper h3{
	padding:20px 30px 20px 30px;
	background-color:#444;
	color:#fff;
	font-size:25px;
	border-bottom:1px solid #ddd;
}
.form_wrapper form{
	display:none;
	background:#fff;
}
.form_wrapper .column{
	width:47%;
	float:left;
}
form.active{
	display:block;
}
form.login{
	width:350px;
}
form.register{
	width:550px;
}
form.forgot_password{
	width:300px;
}
.form_wrapper a{
	text-decoration:none;
	color:#777;
	font-size:12px;
}
.form_wrapper a:hover{
	color:#000;
}
.form_wrapper label{
	display:block;
	padding:10px 30px 0px 30px;
	margin:10px 0px 0px 0px;
}
.form_wrapper input[type="text"],
.form_wrapper input[type="password"]{
	border: solid 1px #E5E5E5;
	background: #FFFFFF;
	margin: 5px 30px 0px 30px;
	padding: 9px;
	display:block;
	font-size:16px;
	width:76%;
	background: 
		-webkit-gradient(
			linear,
			left top,
			left 25,
			from(#FFFFFF),
			color-stop(4%, #EEEEEE),
			to(#FFFFFF)
		);
	background: 
		-moz-linear-gradient(
			top,
			#FFFFFF,
			#EEEEEE 1px,
			#FFFFFF 25px
			);
	-moz-box-shadow: 0px 0px 8px #f0f0f0;
	-webkit-box-shadow: 0px 0px 8px #f0f0f0;
	box-shadow: 0px 0px 8px #f0f0f0;
}
.form_wrapper input[type="text"]:focus,
.form_wrapper input[type="password"]:focus{
	background:#feffef;
}
.form_wrapper .bottom{
	background-color:#444;
	border-top:1px solid #ddd;
	margin-top:20px;
	clear:both;
	color:#fff;
	text-shadow:1px 1px 1px #000;
}
.form_wrapper .bottom a{
	display:block;
	clear:both;
	padding:10px 30px;
	text-align:right;
	color:#ffa800;
	text-shadow:1px 1px 1px #000;
}
.form_wrapper a.forgot{
	float:right;
	font-style:italic;
	line-height:24px;
	color:#ffa800;
	text-shadow:1px 1px 1px #fff;
}
.form_wrapper a.forgot:hover{
	color:#000;
}
.form_wrapper div.remember{
	float:left;
	width:140px;
	margin:20px 0px 20px 30px;
	font-size:11px;
}
.form_wrapper div.remember input{
	float:left;
	margin:2px 5px 0px 0px;
}
.form_wrapper span.error{
	visibility:hidden;
	color:red;
	font-size:11px;
	font-style:italic;
	display:block;
	margin:4px 30px;
}

.form_wrapper input[type="submit"] {
	background: #e3e3e3;
	border: 1px solid #ccc;
	color: #333;
	font-family: "Trebuchet MS", "Myriad Pro", sans-serif;
	font-size: 14px;
	font-weight: bold;
	padding: 8px 0 9px;
	text-align: center;
	width: 150px;
	cursor:pointer;
	float:right;
	margin:15px 20px 10px 10px;
	text-shadow: 0px 1px 0px #fff;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	-moz-box-shadow: 0px 0px 2px #fff inset;
	-webkit-box-shadow: 0px 0px 2px #fff inset;
	box-shadow: 0px 0px 2px #fff inset;
}

.form_wrapper input[type="submit"]:hover {
	background: #d9d9d9;
	-moz-box-shadow: 0px 0px 2px #eaeaea inset;
	-webkit-box-shadow: 0px 0px 2px #eaeaea inset;
	box-shadow: 0px 0px 2px #eaeaea inset;
	color: #222;
}


/**** TAMBAHAN ****/

.left { 
	float:left; 
}
.right { 
	float:right; 
}
.alignleft { 
	float: left; 
	margin-right: 15px; 
}
.alignright { 
	float: right; 
	margin-left: 15px; 
}
.clearfix:after,
form:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.container { 
	background: none repeat scroll 0 0 white;
	margin: 25px 0 25px 65px; 
	position: relative; 
	width: 400px; 
}
#content {
	background: #fff;
	/*background: #f9f9f9;*/
	/*background: -moz-linear-gradient(top,  rgba(248,248,248,1) 0%, rgba(249,249,249,1) 100%);
	background: -webkit-linear-gradient(top,  rgba(248,248,248,1) 0%,rgba(249,249,249,1) 100%);
	background: -o-linear-gradient(top,  rgba(248,248,248,1) 0%,rgba(249,249,249,1) 100%);
	background: -ms-linear-gradient(top,  rgba(248,248,248,1) 0%,rgba(249,249,249,1) 100%);
	background: linear-gradient(top,  rgba(248,248,248,1) 0%,rgba(249,249,249,1) 100%);*/
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f8f8f8', endColorstr='#f9f9f9',GradientType=0 );
	-webkit-box-shadow: 0 1px 0 #fff inset;
	-moz-box-shadow: 0 1px 0 #fff inset;
	-ms-box-shadow: 0 1px 0 #fff inset;
	-o-box-shadow: 0 1px 0 #fff inset;
	box-shadow: 0 1px 0 #fff inset;
	border: 1px solid #c4c6ca;
	margin: 0 auto;
	padding: 25px 0 0;
	position: relative;
	text-align: center;
	text-shadow: 0 1px 0 #fff;
	width: 510px;
}
#content h1 {
	color: #7E7E7E;
	font: bold 25px Helvetica, Arial, sans-serif;
	letter-spacing: -0.05em;
	line-height: 20px;
	margin: 10px 0 30px;
}
#content h1:before,
#content h1:after {
	content: "";
	height: 1px;
	position: absolute;
	top: 10px;
	width: 27%;
}
#content h1:after {
	background: rgb(126,126,126);
	background: -moz-linear-gradient(left,  rgba(126,126,126,1) 0%, rgba(255,255,255,1) 100%);
	background: -webkit-linear-gradient(left,  rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%);
	background: -o-linear-gradient(left,  rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%);
	background: -ms-linear-gradient(left,  rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%);
	background: linear-gradient(left,  rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%);
    right: 0;
}
#content h1:before {
	background: rgb(126,126,126);
	background: -moz-linear-gradient(right,  rgba(126,126,126,1) 0%, rgba(255,255,255,1) 100%);
	background: -webkit-linear-gradient(right,  rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%);
	background: -o-linear-gradient(right,  rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%);
	background: -ms-linear-gradient(right,  rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%);
	background: linear-gradient(right,  rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%);
    left: 0;
}
#content:after,
#content:before {
	background: #f9f9f9;
	background: -moz-linear-gradient(top,  rgba(248,248,248,1) 0%, rgba(249,249,249,1) 100%);
	background: -webkit-linear-gradient(top,  rgba(248,248,248,1) 0%,rgba(249,249,249,1) 100%);
	background: -o-linear-gradient(top,  rgba(248,248,248,1) 0%,rgba(249,249,249,1) 100%);
	background: -ms-linear-gradient(top,  rgba(248,248,248,1) 0%,rgba(249,249,249,1) 100%);
	background: linear-gradient(top,  rgba(248,248,248,1) 0%,rgba(249,249,249,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9f9f9', endColorstr='#f4f4f4',GradientType=0 );
	/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f8f8f8', endColorstr='#f9f9f9',GradientType=0 );*/
	border: 1px solid #c4c6ca;
	content: "";
	display: block;
	height: 100%;
	left: -1px;
	position: absolute;
	width: 100%;
}
#content:after {
	-webkit-transform: rotate(2deg);
	-moz-transform: rotate(2deg);
	-ms-transform: rotate(2deg);
	-o-transform: rotate(2deg);
	transform: rotate(2deg);
	top: 0;
	z-index: -1;
}
#content:before {
	-webkit-transform: rotate(-3deg);
	-moz-transform: rotate(-3deg);
	-ms-transform: rotate(-3deg);
	-o-transform: rotate(-3deg);
	transform: rotate(-3deg);
	top: 0;
	z-index: -2;
}
#content form { margin: 0 20px; position: relative }
#content form input[type="text"],
#content form input[type="password"] {
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-ms-border-radius: 3px;
	-o-border-radius: 3px;
	border-radius: 3px;
	-webkit-box-shadow: 0 1px 0 #fff, 0 -2px 5px rgba(0,0,0,0.08) inset;
	-moz-box-shadow: 0 1px 0 #fff, 0 -2px 5px rgba(0,0,0,0.08) inset;
	-ms-box-shadow: 0 1px 0 #fff, 0 -2px 5px rgba(0,0,0,0.08) inset;
	-o-box-shadow: 0 1px 0 #fff, 0 -2px 5px rgba(0,0,0,0.08) inset;
	box-shadow: 0 1px 0 #fff, 0 -2px 5px rgba(0,0,0,0.08) inset;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
	/*background: #eae7e7 url(http://cssdeck.com/uploads/media/items/8/8bcLQqF.png) no-repeat;*/
	background: #F2F2F2 url(http://cssdeck.com/uploads/media/items/8/8bcLQqF.png) no-repeat;
	border: 1px solid #c8c8c8;
	color: #777;
	font: 13px Helvetica, Arial, sans-serif;
	margin: 0 0 10px;
	padding: 15px 10px 15px 40px;
	width: 80%;
}
#content form input[type="text"]:focus,
#content form input[type="password"]:focus {
	-webkit-box-shadow: 0 0 2px #ed1c24 inset;
	-moz-box-shadow: 0 0 2px #ed1c24 inset;
	-ms-box-shadow: 0 0 2px #ed1c24 inset;
	-o-box-shadow: 0 0 2px #ed1c24 inset;
	box-shadow: 0 0 2px #ed1c24 inset;
	background-color: #fff;
	border: 1px solid #ed1c24;
	outline: none;
}
#username { background-position: 10px 10px !important }
#password { background-position: 10px -53px !important }
#content form input[type="submit"] {
	background: rgb(254,231,154);
	background: -moz-linear-gradient(top,  rgba(254,231,154,1) 0%, rgba(254,193,81,1) 100%);
	background: -webkit-linear-gradient(top,  rgba(254,231,154,1) 0%,rgba(254,193,81,1) 100%);
	background: -o-linear-gradient(top,  rgba(254,231,154,1) 0%,rgba(254,193,81,1) 100%);
	background: -ms-linear-gradient(top,  rgba(254,231,154,1) 0%,rgba(254,193,81,1) 100%);
	background: linear-gradient(top,  rgba(254,231,154,1) 0%,rgba(254,193,81,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fee79a', endColorstr='#fec151',GradientType=0 );
	-webkit-border-radius: 7px;
	-moz-border-radius: 7px;
	-ms-border-radius: 7px;
	-o-border-radius: 7px;
	/*border-radius: 30px;*/
	border-radius: 7px;
	-webkit-box-shadow: 0 1px 0 rgba(255,255,255,0.8) inset;
	-moz-box-shadow: 0 1px 0 rgba(255,255,255,0.8) inset;
	-ms-box-shadow: 0 1px 0 rgba(255,255,255,0.8) inset;
	-o-box-shadow: 0 1px 0 rgba(255,255,255,0.8) inset;
	box-shadow: 0 1px 0 rgba(255,255,255,0.8) inset;
	border: 1px solid #D69E31;
	color: #85592e;
	cursor: pointer;
	float: left;
	font: bold 15px Helvetica, Arial, sans-serif;
	height: 35px;
	/*margin: 20px 0 35px 15px;*/
	margin: 20px 0 35px 30px;
	position: relative;
	text-shadow: 0 1px 0 rgba(255,255,255,0.5);
	width: 120px;
}
#content form input[type="submit"]:hover {
	background: rgb(254,193,81);
	background: -moz-linear-gradient(top,  rgba(254,193,81,1) 0%, rgba(254,231,154,1) 100%);
	background: -webkit-linear-gradient(top,  rgba(254,193,81,1) 0%,rgba(254,231,154,1) 100%);
	background: -o-linear-gradient(top,  rgba(254,193,81,1) 0%,rgba(254,231,154,1) 100%);
	background: -ms-linear-gradient(top,  rgba(254,193,81,1) 0%,rgba(254,231,154,1) 100%);
	background: linear-gradient(top,  rgba(254,193,81,1) 0%,rgba(254,231,154,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fec151', endColorstr='#fee79a',GradientType=0 );
}
#content form div a {
	color: #004a80;
    float: right;
    font-size: 12px;
    margin: 30px 15px 0 0;
    text-decoration: underline;
}
.button {
	background: rgb(247,249,250);
	background: -moz-linear-gradient(top,  rgba(247,249,250,1) 0%, rgba(240,240,240,1) 100%);
	background: -webkit-linear-gradient(top,  rgba(247,249,250,1) 0%,rgba(240,240,240,1) 100%);
	background: -o-linear-gradient(top,  rgba(247,249,250,1) 0%,rgba(240,240,240,1) 100%);
	background: -ms-linear-gradient(top,  rgba(247,249,250,1) 0%,rgba(240,240,240,1) 100%);
	background: linear-gradient(top,  rgba(247,249,250,1) 0%,rgba(240,240,240,1) 100%);
	/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f9fa', endColorstr='#f0f0f0',GradientType=0 );*/
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f9fa', endColorstr='#3F5F89',GradientType=0 );
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.1) inset;
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,0.1) inset;
	-ms-box-shadow: 0 1px 2px rgba(0,0,0,0.1) inset;
	-o-box-shadow: 0 1px 2px rgba(0,0,0,0.1) inset;
	box-shadow: 0 1px 2px rgba(0,0,0,0.1) inset;
	-webkit-border-radius: 0 0 5px 5px;
	-moz-border-radius: 0 0 5px 5px;
	-o-border-radius: 0 0 5px 5px;
	-ms-border-radius: 0 0 5px 5px;
	border-radius: 0 0 5px 5px;
	border-top: 1px solid #CFD5D9;
	padding: 15px 0;
}
.button a {
	background: url(http://cssdeck.com/uploads/media/items/8/8bcLQqF.png) 0 -112px no-repeat;
	color: #7E7E7E;
	font-size: 17px;
	padding: 2px 0 2px 40px;
	text-decoration: none;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
.button a:hover {
	background-position: 0 -135px;
	color: #00aeef;
}

.boxlogin {
	background: none repeat scroll 0 0 white;
	border-radius: 3px 3px 3px 3px;
  box-shadow: 0 0 5px 0;
  display: block;
  height: 310px;
  margin-top: 20px;
  padding: 28px 0 0;
  width: 240px;
}

/************ BUTTON ************/

/* Button Style A */

.button_a {
   border-top: 1px solid #96d1f8;
   /* Old browsers */
   background: #65a9d7;
   text-shadow: rgba(0,0,0,.4) 1px 2px 1px;
   color: white;
   font-size: 18px;
   font-family: 'Lucida Grande', Helvetica, Arial, Sans-Serif;
   text-decoration: none;
   /*padding: 7.5px 15px;*/
   padding: 7.5px 25px;
   vertical-align: middle;
   
   /*margin-left: 15px;
   margin-left: 55px;*/
   margin-left: 40px;

/* Chrome,Safari4+ */
	/*-moz-linear-gradient(center top , #00FF18, #02660B) repeat scroll 0 0 transparent
	 background: -webkit-gradient(linear, left top, left bottom, from(#3e779d), to(#65a9d7));*/
   background: -webkit-gradient(linear, left top, left bottom, from(#00FF18), to(#02660B));
   /* Chrome10+,Safari5.1+ */
   background: -webkit-linear-gradient(top, #00FF18, #02660B);
   /* FF3.6+ */
   background: -moz-linear-gradient(top, #00FF18, #02660B);
   /* IE10+ */
   background: -ms-linear-gradient(top, #00FF18, #02660B);
   /* Opera 11.10+ */
   background: -o-linear-gradient(top, #00FF18, #02660B);
   /* Chrome,Safari4+ */
   -webkit-border-radius: 5px;
   /* FF3.6+ */
   -moz-border-radius: 5px;
   /* Old browsers */
   border-radius: 5px;
   /* Chrome,Safari4+ */
   -webkit-box-shadow: rgba(0,0,0,1) 1px 2px 1px;
   /* FF3.6+ */
   -moz-box-shadow: rgba(0,0,0,1) 1px 2px 1px;
   /* Old browsers */
   box-shadow: rgba(0,0,0,1) 1px 2px 1px;
}

.button_a:hover {
   border-top-color: #28597a;
   background: #28597a;
   color: #ccc;
}

/* Button A Active */

.button_a:active {
   border-top-color: #1b435e;
   background: #1b435e;
}

/* Gradient Background Style A */

#bg_grad_a {
	height: 40px;
	/*width: 360px;*/
	width: 800px;
	padding-top:20px;
	/*padding-left:30px;*/
	padding-left:0px;
	margin-left:-11px;
/* Chrome,Safari4+ */
	-webkit-border-radius: 15px;
/* FF3.6+ */
	-moz-border-radius: 15px;
/* Old browsers */
	border-radius: 15px;
	/*background: rgb(38,38,38);*/

}

.innerpage_title_transp {
	margin-top:30px;
}

.alamat {
	/*background: #24538B;*/
	background:#0AAB03;
	margin: 0 auto;
	padding: 10px;
	border-radius: 10px;
	line-height: 20px;
	font-size: 11px;
	border: 1px solid #848484;
	width: 584px;
	color: #FFF;
}

.kontak1 {
  position: relative;
  margin: 15px 0 auto;
  padding: 20px 20px 20px;
  width: 200px;
  background: #88F989;
  border-radius: 3px;
  height: 145px;
  /*box-shadow: 0px 0px 5px 0px;*/
  border: 1px solid rgba(0, 0, 0, 0.16);
  box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.4);
  
  @include box-shadow(0 0 200px rgba(white, .5), 0 1px 2px rgba(black, .3));

  &:before {
    content: '';
    position: absolute;
    top: -8px; right: -8px; bottom: -8px; left: -8px;
    z-index: -1;
    background: rgba(black, .08);
    border-radius: 4px;
  }  
  
  
.kontak2 {
  position: relative;
  margin:20px 0 auto;
  padding: 20px 20px 20px;
  width: 200px;
  background: #66CCFF;
  border-radius: 3px;
  height: 145px;
  box-shadow: 0px 0px 5px 0px;
  
  @include box-shadow(0 0 200px rgba(white, .5), 0 1px 2px rgba(black, .3));

  &:before {
    content: '';
    position: absolute;
    top: -8px; right: -8px; bottom: -8px; left: -8px;
    z-index: -1;
    background: rgba(black, .08);
    border-radius: 4px;
  }  

/*************** BAck TO Top ***************/

em {
	font: italic 100% "Times New Roman", Times, serif;
}
.credits {
	border-bottom: solid 1px #eee;
	padding-bottom: 10px;
	margin: 0 0 30px;
}
#pagewrap {
	margin: 0 auto;
	width: 600px;
	padding-left: 150px;
	position: relative;
}

/*
Back to top button 
*/
#back-top {
	position: fixed;
	bottom: 30px;
	margin-left: -150px;
}
#back-top a {
	width: 108px;
	display: block;
	text-align: center;
	font: 11px/100% Arial, Helvetica, sans-serif;
	text-transform: uppercase;
	text-decoration: none;
	color: #bbb;
	/* background color transition */
	-webkit-transition: 1s;
	-moz-transition: 1s;
	transition: 1s;
}
#back-top a:hover {
	color: #000;
}
/* arrow icon (span tag) */
#back-top span {
	width: 108px;
	height: 108px;
	display: block;
	margin-bottom: 7px;
	background: url(../assets/images/up-arrow.png) no-repeat center center;
	/* rounded corners */
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;
	/* background color transition */
	-webkit-transition: 1s;
	-moz-transition: 1s;
	transition: 1s;
}
#back-top a:hover span {
	background-color: #777;
}

#full-wrap {
    background: url("../images/bg_repeat.png") repeat scroll 0 -5px rgba(0, 0, 0, 0);
    height: 100%;
}
